
<!DOCTYPE html>
<html style="overflow: hidden;">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>浙江省医疗器械售后服务平台</title>
    <link href="../images/favicon.ico" rel="shortcut icon" />
    <link rel="stylesheet" href="login/bootstrap/css/bootstrap.min.css">
    <link rel="stylesheet" href="dist/css/AdminLTE.min.css">
    <link rel="stylesheet" href="login/font-awesome/css/font-awesome.min.css">
    <link rel="stylesheet" href="login/css/form-elements.css">
    <link rel="stylesheet" href="login/css/style.css">
    <link rel="stylesheet" href="plugins/flavr/flavr.css">
    <link rel="stylesheet" href="plugins/iziModal/css/iziModal.min.css">

    <!-- Favicon and touch icons -->
    <link rel="shortcut icon" href="assets/ico/favicon.png">
    <link rel="apple-touch-icon-precomposed" sizes="144x144" href="login/ico/apple-touch-icon-144-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="114x114" href="login/ico/apple-touch-icon-114-precomposed.png">
    <link rel="apple-touch-icon-precomposed" sizes="72x72" href="login/ico/apple-touch-icon-72-precomposed.png">
    <link rel="apple-touch-icon-precomposed" href="login/ico/apple-touch-icon-57-precomposed.png">
    <style type="text/css">
        .attachment-info{
            font-size: 14px;color: #fff;position: fixed;bottom: 20px;left: 0;width: 100%
        }

    </style>
</head>
<body>

<!-- Top content -->
<div class="top-content">

    <!-- 发送 验证码model -->
    <div id="retrieve-code" style="display:none">
        <div class="box-body" style="margin:5px 0 -10px 0">
            <div class="login-box-body">
                <div class="form-group has-feedback">
                    <input type="text" class="form-control" placeholder="请输入您的手机号码" id="phone" name="phone">
                </div>
                <div class="form-group has-feedback">
                    <input type="text" class="form-control" placeholder="请输入验证码" id="code" name="code">
                </div>
                <div class="row">
                    <div class="col-xs-8">
                        <div class="checkbox icheck">
                            <label class="">
                                <div class="icheckbox_square-blue" aria-checked="false" aria-disabled="false" style="position: relative;">
                                    <input type="checkbox" style="position: absolute; top: -20%; left: -20%; display: block; width: 140%; height: 140%; margin: 0px; padding: 0px; background: rgb(255, 255, 255); border: 0px; opacity: 0;">
                                    <ins class="iCheck-helper" style="position: absolute; top: -20%; left: -20%; display: block; width: 140%; height: 140%; margin: 0px; padding: 0px; background: rgb(255, 255, 255); border: 0px; opacity: 0;">
                                    </ins>
                                </div>
                            </label>
                        </div>
                    </div>
                    <div class="col-xs-4">
                        <input type="button" id="btn" class="btn btn-primary btn-block btn-flat" value="获取验证码"/>
                    </div>
                </div>
                <div class="social-auth-links text-center">
                    <button type="button" class="btn btn-primary btn-block btn-flat" onclick="openPasswordModel();">确定</button>
                </div>
            </div>
        </div>
    </div>

    <!-- 修改密码model -->
    <div id="retrieve-password" style="display:none">
        <div class="box-body" style="margin:5px 0 -10px 0">
            <div class="login-box-body">
                <div class="form-group has-feedback hide">
                    <input type="text" class="form-control" id="phoneHide">
                </div>
                <div class="form-group has-feedback">
                    <input type="password" class="form-control" placeholder="请输入您的新密码" id="newPassword">
                </div>
                <div class="form-group has-feedback">
                    <input type="password" class="form-control" placeholder="请再次输入密码" id="oldPassword">
                </div>
            </div>
        </div>
        <div class="box-footer text-right">
            <button data-iziModal-close class="btn btn-default">取消</button>
            <button type="button" class="btn bg-aqua" data-loading-text="保存中..." id="save" onclick="updatePassword()">保存</button>
        </div>
    </div>


    <div class="inner-bg">
        <div class="container">
            <div class="row">
                <div class="col-sm-8 col-sm-offset-2 text">
                    <h1>
                        <img style="width: 50px" src="images/hangzhou.jpg">
                        <span>浙江省医疗器械售后服务平台</span>
                    </h1>
                </div>
            </div>
            <div class="row">
                <div class="col-sm-6 col-sm-offset-3 form-box">
                    <div class="form-top">
                        <div class="form-top-left">
                            <h3>登录</h3>
                            <p>输入账号登录</p><!-- 手机号密码登录 -->
                        </div>
                        <div class="form-top-right">
                            <i class="fa fa-key"></i>
                        </div>
                    </div>
                    <div class="form-bottom">
                        <form id="form" role="form" action="login" method="post" class="login-form">
                            <div class="form-group">
                                <label class="sr-only" for="username">登录</label>
                                <input type="text" name="username" placeholder="请输入帐号" class="form-username form-control" id="username" value="">
                            </div>
                            <div class="form-group">
                                <label class="sr-only" for="password">密码</label>
                                <input type="password" name="password" placeholder="密码" class="form-password form-control" id="password">
                            </div>
                            <p class="text-danger"></p>
                            <p>
                                <button type="button" onclick="login()" class="btn">登录</button>
                        </form>
                        <!--<a href="javascript:openCodeModel();" style="position: relative; left: 420px; top: 0px;" >忘记密码？</a>-->
                    </div>
                    <span onclick="WX_Login()" class="pull-right text-aqua" style="position: absolute; right: 7%;bottom: 2%;cursor:pointer">扫码登录>></span>
                    <div class="attachment-info">
                        <label>协作单位：</label>
                       <!-- <span>浙江省科学技术厅</span>
                        <span>|</span>
                        <span>浙江省对外科学技术交流中心</span>
                        <span>|</span>
                        <span>浙江省卫生和计划生育委员会</span>
                        <span>|</span>-->
                        <span>浙江省医疗器械行业协会</span>
                    </div>
                </div>
                <div class="col-sm-6 col-sm-offset-3 eq_form-box" style="display: none">
                    <div class="form-top">
                        <h3 style="text-align: center">请扫描下方的二维码登录</h3>
                    </div>
                    <div class="form-bottom">
                        <div style="width:200px; height: 200px;">
                            <img src="" alt="">
                        </div>
                    </div>
                    <span onclick="ZHMM_Login()" class="pull-right text-aqua" style="position: absolute; right: 7%;bottom: 2%;cursor:pointer">账号密码登录>></span>
                    <div class="attachment-info">
                        <label>协作单位：</label>
                        <!-- <span>浙江省科学技术厅</span>
                         <span>|</span>
                         <span>浙江省对外科学技术交流中心</span>
                         <span>|</span>
                         <span>浙江省卫生和计划生育委员会</span>
                         <span>|</span>-->
                        <span>浙江省医疗器械行业协会</span>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<div class="request-image"  style="display:none;position: fixed;width: 100%;top: 0;left: 0;height: 100%;z-index: 9999;background: rgba(255, 255, 255, 0)">
    <img src="images/request-sending.gif" style="position: absolute;margin-top: -100px;top: 50%;left: 50%;margin-left: -100px;width: 200px;height: 200px;z-index: 9999999">
</div>

<!-- Javascript -->
<script src="login/js/jquery-1.11.1.min.js"></script>
<script src="login/bootstrap/js/bootstrap.min.js"></script>
<script src="login/js/jquery.backstretch.min.js"></script>
<script src="login/js/scripts.js"></script>
<script src="plugins/flavr/flavr.min.js"></script>
<script src="plugins/iziModal/js/iziModal.min.js"></script>
</body>
<script type="text/javascript">

    $(document).ready(function (){
        document.onkeydown = function (event) {
            var e = event || window.event;
            if (e && e.keyCode == 13) { //回车键的键值为13
                login();
            }
        };
    });

    function login(){
        $(".request-image").show();
        $.ajax({
            url:'user/userLoginByWeb',
            type:'POST',
            dataType:"json",
            data:{"userName":$("#username").val(),"password":$("#password").val(),"loginType":2},	// 参数
            success:function(data){
                $(".request-image").hide();
                try {
                    if(data.ret == 200){
                        location.href="index/page";

                    }else {
                        $(".text-danger").html(data.msg);
                    }
                } catch (error) {
                    new $.flavr({content:"操作遇到问题",closeOverlay:true,closeEsc:true,autoclose:true,timeout:1500,buttons:[{text:'确定',style:'danger',action:function(){}}]});
                }
            },
            failure : function() {
                $(".request-image").hide();
                new $.flavr({content:"操作遇到问题",closeOverlay:true,closeEsc:true,autoclose:true,timeout:1500,buttons:[{text:'操作失败',style:'danger',action:function(){}}]});
            }
        });

    }

    // 发送验证码model
    $("#retrieve-code").iziModal({
        title:"找回密码",
        headerColor: '#00c0ef',
        theme: '',  // light
        attached: '', // bottom, top
        icon: null,
        iconText: null,
        iconColor: '',
        rtl: false,
        width: 600,
        padding: 0,
        radius: 3,
        zindex: 1040,
        iframe: false,
        iframeHeight: 400,
        iframeURL: null,
        focusInput: false,
        group: '',
        loop: false,
        navigateCaption: true,
        bodyOverflow:false,
        navigateArrows: true, // closeToModal, closeScreenEdge
        history: false,
        restoreDefaultContent: false,
        autoOpen: false, // Boolean, Number
        bodyOverflow: false,
        fullscreen: true,
        openFullscreen: false,
        closeOnEscape: true,
        overlay: true,
        overlayClose: false,
        overlayColor: 'rgba(0, 0, 0, 0.4)',
        timeout: false,
        timeoutProgressbar: false,
        pauseOnHover: false,
        timeoutProgressbarColor: 'rgba(255,255,255,0.5)',
        transitionIn: 'comingIn',
        transitionOut: 'comingOut',
        transitionInOverlay: 'fadeIn',
        transitionOutOverlay: 'fadeOut',
        onFullscreen: function(){},
        onResize: function(){},
        onOpening: function(){},
        onOpened: function(){},
        onClosing: function(){},
        onClosed: function(){
            $("#phone").val("");
            $("#code").val("");
        }
    });

    // 找回密码model
    $("#retrieve-password").iziModal({
        title:"找回密码",
        headerColor: '#00c0ef',
        theme: '',  // light
        attached: '', // bottom, top
        icon: null,
        iconText: null,
        iconColor: '',
        rtl: false,
        width: 600,
        padding: 0,
        radius: 3,
        zindex: 1040,
        iframe: false,
        iframeHeight: 400,
        iframeURL: null,
        focusInput: false,
        group: '',
        loop: false,
        navigateCaption: true,
        bodyOverflow:false,
        navigateArrows: true, // closeToModal, closeScreenEdge
        history: false,
        restoreDefaultContent: false,
        autoOpen: false, // Boolean, Number
        bodyOverflow: false,
        fullscreen: true,
        openFullscreen: false,
        closeOnEscape: true,
        overlay: true,
        overlayClose: false,
        overlayColor: 'rgba(0, 0, 0, 0.4)',
        timeout: false,
        timeoutProgressbar: false,
        pauseOnHover: false,
        timeoutProgressbarColor: 'rgba(255,255,255,0.5)',
        transitionIn: 'comingIn',
        transitionOut: 'comingOut',
        transitionInOverlay: 'fadeIn',
        transitionOutOverlay: 'fadeOut',
        onFullscreen: function(){},
        onResize: function(){},
        onOpening: function(){},
        onOpened: function(){},
        onClosing: function(){},
        onClosed: function(){
            $("#phoneHide").val("");
            $("#newPassword").val("");
            $("#oldPassword").val("");
        }
    });

    // 点击忘记密码弹出发送验证码model框
    function openCodeModel(){
        $("#retrieve-code").iziModal('open');
    }

    // 验证码倒计时60秒
    var wait=60;
    function sendCode(obj) {
        if (wait == 0) {
            obj.removeAttribute("disabled");
            obj.value="重新发送";
            wait = 60;
        } else {
            obj.setAttribute("disabled", true);
            obj.value="正在发送(" + wait + ")";
            wait--;
            setTimeout(function() {
                    sendCode(obj)
                },
                1000)
        }
    }

    // 倒计时
    $("#btn").click(function(){
        var phone = $("#phone").val();	// 获取手机号码
        var partten = /^1[34578]\d{9}$/;
        // 验证手机号码
        if(phone == null || phone ==""){
            new $.flavr({content:"请输入手机号码",closeOverlay:true,closeEsc:true,autoclose:true,timeout:1500,buttons:[{text:'确定',style:'danger',action:function(){}}]});
        }else if(!partten.test(phone)){
            new $.flavr({content:"手机号码格式有误",closeOverlay:true,closeEsc:true,autoclose:true,timeout:1500,buttons:[{text:'确定',style:'danger',action:function(){}}]});
        }else{
            var obj = this;
            // 请求调用验证码
            $.ajax({
                url:'../user/sendCode',
                type:'POST',
                data:{"mobile":phone},	// 参数
                async : false, 	//默认为true 异步
                success:function(data){
                    try {
                        if(data.ret == 200){
                            sendCode(obj);		// 开始计时
                        }else {
                            new $.flavr({content:data.msg,closeOverlay:true,closeEsc:true,autoclose:true,timeout:1500,buttons:[{text:'确定',style:'danger',action:function(){}}]});
                        }
                    } catch (error) {
                        new $.flavr({content:"操作遇到问题",closeOverlay:true,closeEsc:true,autoclose:true,timeout:1500,buttons:[{text:'确定',style:'danger',action:function(){}}]});
                    }
                },
                failure : function() {
                    new $.flavr({content:"操作遇到问题",closeOverlay:true,closeEsc:true,autoclose:true,timeout:1500,buttons:[{text:'操作失败',style:'danger',action:function(){}}]});
                }
            });
        }
    });

    // 点击确认后提交验证码校验成功后弹出修改 密码Model
    function openPasswordModel(){
        var phone = $("#phone").val();	// 获取手机号码
        var partten = /^1[34578]\d{9}$/;
        var code = $("#code").val();	// 获取验证码
        if(phone == null || phone ==""){
            new $.flavr({content:"请输入手机号码",closeOverlay:true,closeEsc:true,autoclose:true,timeout:1500,buttons:[{text:'确定',style:'danger',action:function(){}}]});
        }else if(!partten.test(phone)){
            new $.flavr({content:"手机号码格式有误",closeOverlay:true,closeEsc:true,autoclose:true,timeout:1500,buttons:[{text:'确定',style:'danger',action:function(){}}]});
        }else if(code == null || code == ""){
            new $.flavr({content:"请输入验证码",closeOverlay:true,closeEsc:true,autoclose:true,timeout:1500,buttons:[{text:'确定',style:'danger',action:function(){}}]});
        }else{
            // 请求校验验证码
            $.ajax({
                url:'<%=basePath%>/user/checkCode',
                type:'POST',
                data:{"phone":phone,"code":code},	// 参数
                async : false, 	//默认为true 异步
                success:function(data){
                    try {
                        if (data.ret == 200) {
                            $("#retrieve-code").iziModal('close');
                            $("#retrieve-password").iziModal('open');
                            $("#phoneHide").val(phone);	// 赋值隐藏域手机号码
                        }else{
                            new $.flavr({content:data.msg,closeOverlay:true,closeEsc:true,autoclose:true,timeout:1500,buttons:[{text:'确定',style:'danger',action:function(){}}]});
                        }
                    } catch (error) {
                        new $.flavr({content:"操作遇到问题",closeOverlay:true,closeEsc:true,autoclose:true,timeout:1500,buttons:[{text:'确定',style:'danger',action:function(){}}]});
                    }
                },
                failure : function() {
                    new $.flavr({content:"操作遇到问题",closeOverlay:true,closeEsc:true,autoclose:true,timeout:1500,buttons:[{text:'操作失败',style:'danger',action:function(){}}]});
                }
            });
        }
    }

    // 找回密码
    function updatePassword(){
        var phone = $("#phoneHide").val();	// 获取手机号码
        var newPassword = $("#newPassword").val();	// 获取新密码
        var oldPassword = $("#oldPassword").val();	// 获取旧密码
        if(phone == null || phone ==""){
            new $.flavr({content:"手机号码未获取到",closeOverlay:true,closeEsc:true,autoclose:true,timeout:1500,buttons:[{text:'确定',style:'danger',action:function(){}}]});
        }else if(newPassword == null || newPassword ==""){
            new $.flavr({content:"请输入新密码",closeOverlay:true,closeEsc:true,autoclose:true,timeout:1500,buttons:[{text:'确定',style:'danger',action:function(){}}]});
        }else if(newPassword.length < 6 || newPassword.length > 12){
            new $.flavr({content:"密码位数请控制在6~12位之间",closeOverlay:true,closeEsc:true,autoclose:true,timeout:1500,buttons:[{text:'确定',style:'danger',action:function(){}}]});
        }else if(newPassword != oldPassword){
            new $.flavr({content:"两次密码输入不一致",closeOverlay:true,closeEsc:true,autoclose:true,timeout:1500,buttons:[{text:'确定',style:'danger',action:function(){}}]});
        }else{
            // 找回密码
            $.ajax({
                url:'../user/updatePasswordByPhone',
                type:'POST',
                data:{"phone":phone,"password":newPassword},	// 参数
                async : false, 	//默认为true 异步
                success:function(data){
                    try {
                        if (data.ret == 1) {
                            new $.flavr({content:data.msg,closeOverlay:true,closeEsc:true,autoclose:true,timeout:1500,buttons:[{text:'确定',style:'success',action:function(){}}]});
                            $("#retrieve-password").iziModal('close');
                        }else{
                            new $.flavr({content:data.msg,closeOverlay:true,closeEsc:true,autoclose:true,timeout:1500,buttons:[{text:'确定',style:'danger',action:function(){}}]});
                        }
                    } catch (error) {
                        new $.flavr({content:"操作遇到问题",closeOverlay:true,closeEsc:true,autoclose:true,timeout:1500,buttons:[{text:'确定',style:'danger',action:function(){}}]});
                    }
                },
                failure : function() {
                    new $.flavr({content:"操作遇到问题",closeOverlay:true,closeEsc:true,autoclose:true,timeout:1500,buttons:[{text:'操作失败',style:'danger',action:function(){}}]});
                }
            });
        }
    }

    //切换扫码登录
    function WX_Login() {
        $('.form-box').hide();
        $('.eq_form-box').show();
    }
    function ZHMM_Login() {
        $('.eq_form-box').hide();
        $('.form-box').show();
    }

</script>
</html>